<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        html, body {
            width: 100%;
            height: 100%;
            letter-spacing: 1px;
        }
        #loading { background: #fff url(../../static/public_file/images/jiazai.gif) no-repeat scroll center center; height: 100%; width: 100%; background-size: 10%; position: fixed; margin-top: 0px; top: 0px; left: 0px; bottom: 0px; overflow: hidden !important; right: 0px; z-index: 999999;background-color: rgba(255, 255, 255, 0.08);}
    </style>
</head>
<body>
    <div id="loading">
        <div id="loading-center">
        </div>
    </div>

    <div style="width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;">
        <div style="border: #00A680 solid 1px;padding: 20px;">
            <div style="width: 100%;">
                <label for="">工&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号：</label>
                <input type="text" id="job_number" style="width: 300px;height: 25px;border: #999999 solid 1px;outline: none;border-radius: 3px;" placeholder="请填写工号">
            </div>
            <div style="width: 100%;margin-top: 15px;">
                <label for="">请假原因：</label>
                <input type="text" id="reason" style="width: 300px;height: 25px;border: #999999 solid 1px;outline: none;border-radius: 3px;" placeholder="请填写请假原因">
            </div>

            <div style="width: 100%;height: 40px;text-align: center;margin-top: 25px;">
                <button onclick="summit_data()" style="width: 130px;border: #00a0e9 solid 1px;background: #00a0e9;color: white;letter-spacing: 6px;height: 30px;margin-top: 5px;">
                    确认
                </button>
            </div>
        </div>
    </div>

    <script>
        window.onload = function () {
            document.getElementById("loading").style.display = "none";
        };

        function summit_data() {
            var job_number = document.getElementById("job_number").value;
            if (!job_number) {
                alert("请输入您的工号！")
                return false
            }
            var reason = document.getElementById("reason").value;
            if (!reason) {
                alert("请输入请假原因！")
                return false
            }
            document.getElementById("loading").style.display = "inline-block";
            var xhr = new XMLHttpRequest();
            var local_host = window.location.host;          // 获取当前IP
            xhr.open('post', "https://oaapi.hbjsxrmyy.com/system-setup/topic_leave");
            xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
            xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
            xhr.send("job_number="+job_number+"&reason="+reason+"&topic_type={{ topic_type }}"+"&topic_year={{ topic_year }}"+"&topic_num={{ topic_num }}");
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        document.getElementById("loading").style.display = "none";
                        var JsonDate = JSON.parse(xhr.responseText);
                        if (JsonDate["code"] === 200){
                            alert("操作成功！");
                            window.location.reload()
                        }else {
                            alert(JsonDate["message"]);
                        }
                    }
                }
            };
        }
    </script>
</body>
</html>